<template>
    <div>
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="科目" label-width="70px" prop="">
                <el-input clearable v-model="formInline.subject" placeholder="请输入科目"></el-input>
            </el-form-item>
            <el-form-item label="题目" label-width="70px" prop="source">
                <el-input clearable v-model="formInline.question" placeholder="请输入题目"></el-input>
            </el-form-item>
            <el-form-item label="分数" label-width="70px" prop="grade">
                <el-input clearable v-model="formInline.score" placeholder="请输入分数"></el-input>
            </el-form-item>
            <el-form-item label="难度" label-width="70px" prop="level">
                <el-rate v-model="formInline.level"></el-rate>
            </el-form-item>
            <el-form-item label="章节" label-width="70px" prop="description">
                <el-input clearable v-model="formInline.section" placeholder="请输入章节"></el-input>
            </el-form-item>
            <el-form-item label="试卷码" label-width="70px" prop="description">
                <el-input clearable v-model="paperId" placeholder="添加输入试卷码"></el-input>
            </el-form-item>
            <el-form-item style="margin-left: 10px">
                <el-button icon="el-icon-refresh" @click="reset">重置</el-button>
                <el-button @click="select" type="primary" icon="el-icon-search">查询</el-button>
                <el-button type="success" icon="el-icon-plus">添加</el-button>
                <el-button type="warning" icon="el-icon-download">导出</el-button>
                <el-button type="warning" icon="el-icon-download" @click="pushPaper">试卷</el-button>
            </el-form-item>
        </el-form>
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="选择" name="1">
                <el-table border
                          style="width: 100%"
                          ref="multipleTable"
                          :data="tableData">
                    <el-table-column :label="item.propName" :property="item.prop" v-for="(item) in tableColumnList"
                                     :key="item.prop" sortable>
                        <template slot-scope="scope" class="block">
                            <span v-if="item.propName==='科目'"><el-tag>{{scope.row[scope.column.property]}}</el-tag></span>
                            <span v-else-if="item.propName==='难度'">
                                <el-rate disabled v-model="scope.row.level"></el-rate>
                            </span>
                            <span v-else>{{scope.row[scope.column.property]}}</span>
                        </template>
                    </el-table-column>

                    <el-table-column fixed="right" label="操作" width="175px">
                        <template slot-scope="scope">
                            <el-button @click="addPaper(scope.row.id)" type="primary" size="mini"
                                       icon="el-icon-check"></el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination style="padding-top: 15px"
                               @size-change="handleSizeChange"
                               @current-change="handleCurrentChange"
                               :current-page.sync="current"
                               :page-sizes="[1, 2, 3, 6, 15]"
                               :page-size="size"
                               layout="total, sizes, prev, pager, next, jumper"
                               :total="this.total">
                </el-pagination>
            </el-tab-pane>
            <el-tab-pane label="填空" name="2">
                <el-table border
                          style="width: 100%"
                          ref="multipleTable"
                          :data="tableData">
                    <el-table-column :label="item.propName" :property="item.prop" v-for="(item) in tableColumnList"
                                     :key="item.prop" sortable>
                        <template slot-scope="scope" class="block">
                            <span v-if="item.propName==='科目'"><el-tag>{{scope.row[scope.column.property]}}</el-tag></span>
                            <span v-else-if="item.propName==='难度'">
                                <el-rate disabled v-model="scope.row.level"></el-rate>
                            </span>
                            <span v-else>{{scope.row[scope.column.property]}}</span>
                        </template>
                    </el-table-column>

                    <el-table-column fixed="right" label="操作" width="175px">
                        <template slot-scope="scope">
                            <el-button @click="addPaper(scope.row.id)" type="primary" size="mini"
                                       icon="el-icon-check"></el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination style="padding-top: 15px"
                               @size-change="handleSizeChange"
                               @current-change="handleCurrentChange"
                               :current-page.sync="current"
                               :page-sizes="[1, 2, 3, 6, 15]"
                               :page-size="size"
                               layout="total, sizes, prev, pager, next, jumper"
                               :total="this.total">
                </el-pagination>
            </el-tab-pane>
            <el-tab-pane label="判断" name="3">
                <el-table border
                          style="width: 100%"
                          ref="multipleTable"
                          :data="tableData">
                    <el-table-column :label="item.propName" :property="item.prop" v-for="(item) in tableColumnList"
                                     :key="item.prop" sortable>
                        <template slot-scope="scope" class="block">
                            <span v-if="item.propName==='科目'"><el-tag>{{scope.row[scope.column.property]}}</el-tag></span>
                            <span v-else-if="item.propName==='难度'">
                                <el-rate disabled v-model="scope.row.level"></el-rate>
                            </span>
                            <span v-else>{{scope.row[scope.column.property]}}</span>
                        </template>
                    </el-table-column>

                    <el-table-column fixed="right" label="操作" width="175px">
                        <template slot-scope="scope">
                            <el-button @click="addPaper(scope.row.id)" type="primary" size="mini"
                                       icon="el-icon-check"></el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <el-pagination style="padding-top: 15px"
                               @size-change="handleSizeChange"
                               @current-change="handleCurrentChange"
                               :current-page.sync="current"
                               :page-sizes="[1, 2, 3, 6, 15]"
                               :page-size="size"
                               layout="total, sizes, prev, pager, next, jumper"
                               :total="this.total">
                </el-pagination>
            </el-tab-pane>
            <el-tab-pane label="主观" name="4">
                <el-table border
                          style="width: 100%"
                          ref="multipleTable"
                          :data="tableData">
                    <el-table-column :label="item.propName" :property="item.prop" v-for="(item) in tableColumnList"
                                     :key="item.prop" sortable>
                        <template slot-scope="scope" class="block">
                            <span v-if="item.propName==='科目'"><el-tag>{{scope.row[scope.column.property]}}</el-tag></span>
                            <span v-else-if="item.propName==='难度'">
                                <el-rate disabled v-model="scope.row.level"></el-rate>
                            </span>
                            <span v-else>{{scope.row[scope.column.property]}}</span>
                        </template>
                    </el-table-column>

                    <el-table-column fixed="right" label="操作" width="175px">
                                                <template slot-scope="scope">
                                                    <el-button @click="addPaper(scope.row.id)" type="primary" size="mini"
                                                               icon="el-icon-check"></el-button>
                                                </template>
                    </el-table-column>
                </el-table>
                <el-pagination style="padding-top: 15px"
                               @size-change="handleSizeChange"
                               @current-change="handleCurrentChange"
                               :current-page.sync="current"
                               :page-sizes="[1, 2, 3, 6, 15]"
                               :page-size="size"
                               layout="total, sizes, prev, pager, next, jumper"
                               :total="this.total">
                </el-pagination>
            </el-tab-pane>
        </el-tabs>
    </div>

</template>
<script>
    export default {
        name: "TeacherPaperManage",
        created() {
            this.activeName = "1";
            // this.paperId = this.$route.query.paperId //获取paperId
            this.paperId = this.$route.query.paperId //获取paperId
            console.log(this.paperId);
            // if(this.paperId==undefined){
            //     this.paperId = -1
            // }
            this.select();
        },
        methods: {
            pushPaper(){
                this.$router.push({
                    path: "/teacher/teacherPaper",
                });
            },
            handleClick(tab, event) {
                console.log(tab, event);
                this.select();
            },
            select() {
                if (this.activeName === "1") {
                    this.postRequest('/multiQuestion/selectAll/' + this.current + '/' + this.size, this.formInline).then(resp => {
                        // 看一下返回信息
                        // console.log(this.formInline);
                        // alert(JSON.stringify(resp));
                        if (resp) {
                            // this.tableData = resp.data.records;
                            this.tableData = resp.data.records;
                            this.total = resp.data.total;
                        }
                    })
                } else if (this.activeName === "2") {
                    this.postRequest('/fillQuestion/selectAll/' + this.current + '/' + this.size, this.formInline).then(resp => {
                        // 看一下返回信息
                        // console.log(this.formInline);
                        // alert(JSON.stringify(resp));
                        if (resp) {
                            this.tableData = resp.data.records;
                            this.total = resp.data.total;
                        }
                    })
                } else if (this.activeName === "3") {
                    this.postRequest('/judgeQuestion/selectAll/' + this.current + '/' + this.size, this.formInline).then(resp => {
                        // 看一下返回信息
                        // console.log(this.formInline);
                        // alert(JSON.stringify(resp));
                        if (resp) {
                            this.tableData = resp.data.records;
                            this.total = resp.data.total;
                        }
                    })
                } else if (this.activeName === "4") {
                    this.postRequest('/subjectiveQuestion/selectAll/' + this.current + '/' + this.size, this.formInline).then(resp => {
                        // 看一下返回信息
                        // console.log(this.formInline);
                        // alert(JSON.stringify(resp));
                        if (resp) {
                            this.tableData = resp.data.records;
                            this.total = resp.data.total;
                        }
                    })
                }

            },
            addPaper(questionId){
                this.$message("正在开发,"+this.paperId+questionId+this.activeName)
                if(this.paperId==undefined){
                    this.$message("尚未指定试卷码")
                }else{
                    let paperInfo={
                        "paperId": this.paperId,
                        "questionType": this.activeName,
                        "questionId": questionId,
                    }
                    this.postRequest('/paperManage/insert',paperInfo).then(res=>{
                        if(res){
                            console.log(res);
                        }
                    })
                }

            },
            // 分页改变每页数量
            handleSizeChange(size) {
                this.size = size;
                this.select();
            },
            // 分页改变当前页数
            handleCurrentChange(current) {
                this.current = current;
                this.select();
            },
            reset() {
                this.formInline.subject = null;
                this.formInline.question = null;
                this.formInline.score = null;
                this.formInline.section = null;
                this.formInline.level = null;
                this.select();
            },
        },
        data() {
            return {
                paperId: null,
                activeName: "1",
                tokenStr: localStorage.getItem('tokenStr'),
                // 分页
                size: 6,
                current: 1,
                total: 0,
                tableData: null,
                tableColumnList:
                    [
                        {prop: 'subject', propName: '科目'},
                        {prop: 'question', propName: '题目'},
                        {prop: 'score', propName: '分数'},
                        {prop: 'section', propName: '章节'},
                        {prop: 'level', propName: '难度'},
                    ],
                formInline: {
                    "subject": null,
                    "question": null,
                    "score": null,
                    "section": null,
                    "level": null,
                },

                currentExamId: 0, // 存储当前行数据
            }
        },
    }
</script>